﻿<%@ Page Title="" Language="C#" MasterPageFile="~/TsSite.Master" AutoEventWireup="true" CodeBehind="ServiceCarScheduleUsingGoogleMaps.aspx.cs" Inherits="TireService.Web.Casehandling.ServiceCarScheduleUsingGoogleMaps" %>

<%@ Register assembly="DevExpress.Web.v11.1, Version=11.1.12.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxPanel" tagprefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v11.1, Version=11.1.12.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web.ASPxRoundPanel" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.ASPxGridView.v11.1.Export, Version=11.1.12.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web.ASPxGridView.Export" TagPrefix="dxwgv" %>
<%@ Register assembly="DevExpress.Web.ASPxGridView.v11.1, Version=11.1.12.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxGridView" tagprefix="dxwgv" %>
<%@ Register assembly="DevExpress.Web.ASPxEditors.v11.1, Version=11.1.12.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxEditors" tagprefix="dxe" %>


<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
        var directionDisplay;
        var directionsService = new google.maps.DirectionsService();
        var map;

        function gvCarNeedService_SelectionChanged(s, e) {
            //s.GetSelectedFieldValues("LatLong", GetSelectedFieldValuesCallback);
        }

        function GetSelectedFieldValuesCallback(values) {
            var start = "56.1475826, 8.9880184";  //document.getElementById("start").value;
            var end = "56.1475826, 8.9880184" //document.getElementById("end").value;
            var waypts = [];
            var checkboxArray = document.getElementById("waypoints");
            for (var i = 0; i < values.length; i++) {
                //if (checkboxArray.options[i].selected == true) {
                    waypts.push({
                        location: values[i],
                        stopover: true
                    });
                //}
            }

            var request = {
                origin: start,
                destination: end,
                waypoints: waypts,
                optimizeWaypoints: true,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            };
            directionsService.route(request, function (response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(response);
                    var route = response.routes[0];
                    var summaryPanel = document.getElementById("directions_panel");
                    summaryPanel.innerHTML = "";
                    // For each route, display summary information.
                    for (var i = 0; i < route.legs.length; i++) {
                        var routeSegment = i + 1;
                        summaryPanel.innerHTML += "<b>Route Segment: " + routeSegment + "</b><br />";
                        summaryPanel.innerHTML += route.legs[i].start_address + " to ";
                        summaryPanel.innerHTML += route.legs[i].end_address + "<br />";
                        summaryPanel.innerHTML += route.legs[i].distance.text + "<br /><br />";
                    }
                }
            });
        }


        function initialize() {
            directionsDisplay = new google.maps.DirectionsRenderer();
            var denmark = new google.maps.LatLng(56.1475826, 8.9880184);
            var myOptions = {
                zoom: 6,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                center: denmark
            }
            map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
            directionsDisplay.setMap(map);
        }

        function btnClick() 
        {
            gvCarNeedService.GetSelectedFieldValues("LatLong", calcRoute);
        }

        function calcRoute(values) {
            var start = "56.1475826, 8.9880184";  //document.getElementById("start").value;
            var end = "56.1475826, 8.9880184" //document.getElementById("end").value;
            var waypts = [];
            var checkboxArray = values;
            document.getElementById("waypoints");
            for (var i = 0; i <  checkboxArray.length; i++) {
                //if (checkboxArray.options[i].selected == true) {
                    waypts.push({
                        location: checkboxArray[i].value,
                        stopover: true
                    });
                //}
            }
            
            var request = {
                origin: start,
                destination: end,
                waypoints: waypts,
                optimizeWaypoints: true,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            };
            directionsService.route(request, function (response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(response);
                    var route = response.routes[0];
                    var summaryPanel = document.getElementById("directions_panel");
                    summaryPanel.innerHTML = "";
                    // For each route, display summary information.
                    for (var i = 0; i < route.legs.length; i++) {
                        var routeSegment = i + 1;
                        summaryPanel.innerHTML += "<b>Tur: " + routeSegment + "</b><br />";
                        summaryPanel.innerHTML += route.legs[i].start_address + " til ";
                        summaryPanel.innerHTML += route.legs[i].end_address + "<br />";
                        summaryPanel.innerHTML += route.legs[i].distance.text + "<br /><br />";
                    }
                }
            });
        }
    </script>


    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <dxwgv:ASPxGridView ID="gvCarNeedService" runat="server" 
                Caption="Biler afventende hjulskift service" 
                ClientInstanceName="gvCarNeedService" Width="100%"
                KeyFieldName="TireSetId" AutoGenerateColumns="False" EnableCallBacks="False" 
                oncustomunboundcolumndata="gvCarNeedService_CustomUnboundColumnData" 
                OnFocusedRowChanged="gvCarNeedService_FocusedRowChanged"
                oncustombuttoncallback="gvCarNeedService_CustomButtonCallback">
                <SettingsLoadingPanel Text="Henter&amp;hellip;" />
                <Border BorderWidth="0px" />
                <Settings ShowVerticalScrollBar="true" ShowHeaderFilterButton="False" ShowGroupPanel="false" ShowFilterRow="False" />
                <SettingsPager AlwaysShowPager="False" PageSize="20" Position="Bottom">
                    <Summary 
                        AllPagesText="Sider: {0} - {1} ({2} biler)" 
                        Text="Side {0} af {1} ({2} biler)" />
                </SettingsPager>
                <SettingsBehavior ProcessFocusedRowChangedOnServer="true" AllowFocusedRow="true" ConfirmDelete="True" AllowGroup="true" AllowDragDrop="false" />
                <ClientSideEvents SelectionChanged="gvCarNeedService_SelectionChanged" />
                <Columns>
                    <%--<dxwgv:GridViewCommandColumn VisibleIndex="1">
                        <CustomButtons>
                            <dxwgv:GridViewCommandColumnCustomButton Text="Service tæt på" ID="NearbyServiceSchedule" />
                        </CustomButtons>
                    </dxwgv:GridViewCommandColumn>--%>
                    <dxwgv:GridViewCommandColumn ShowSelectCheckbox="True" VisibleIndex="0">
                    </dxwgv:GridViewCommandColumn>
                    <dxwgv:GridViewDataColumn FieldName="CarId" Visible="false" VisibleIndex="4" Caption="CarId">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="CustomerId" Visible="false" VisibleIndex="4" Caption="CustomerId">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="SubscriptionId" Visible="false" VisibleIndex="4" Caption="SubscriptionId">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="TireSetId" Visible="false" VisibleIndex="4" Caption="TireSetId">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="ContainerId" Visible="false" VisibleIndex="4" Caption="ContainerId">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="Address" Visible="false" VisibleIndex="4" Caption="Address">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="ZipCode" Visible="false" VisibleIndex="4" Caption="ZipCode">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="City" Visible="false" VisibleIndex="4" Caption="City">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="CountryId" Visible="false" VisibleIndex="4" Caption="CountryId">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="Longitude" Visible="false" VisibleIndex="4" Caption="Longitude">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="Latitude" Visible="false" VisibleIndex="4" Caption="Latitude">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="LongitudePrimary" Visible="false" VisibleIndex="4" Caption="LongitudePrimary">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="LatitudePrimary" Visible="false" VisibleIndex="4" Caption="LatitudePrimary">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="LatLong" UnboundType="String" Visible="true" VisibleIndex="4" Caption="LatLong">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="LongitudeSecondary" Visible="false" VisibleIndex="4" Caption="LongitudeSecondary">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="LatitudeSecondary" Visible="false" VisibleIndex="4" Caption="LatitudeSecondary">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataTextColumn FieldName="ContainerNumber" VisibleIndex="5" Caption="Lager">
                    </dxwgv:GridViewDataTextColumn>
                    <dxwgv:GridViewDataTextColumn FieldName="CarBrandDescription" VisibleIndex="6" Caption="Bilmærke">
                    </dxwgv:GridViewDataTextColumn>
                    <dxwgv:GridViewDataColumn FieldName="Model" VisibleIndex="7" Caption="Model">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="RegistrationNumber" VisibleIndex="8" Caption="Reg.nr.">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="PrimaryAddress" VisibleIndex="9" Caption="Adresse">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="PrimaryCity" VisibleIndex="10" Caption="By">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="CustomerCountryId" VisibleIndex="10" Caption="CustomerCountryId" Visible="false">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="PrimaryZipCode" VisibleIndex="10" Caption="PrimaryZipCode" Visible="false">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="SecondaryAddress" VisibleIndex="9" Caption="SecondaryAddress" Visible="false">
                    </dxwgv:GridViewDataColumn>          
                    <dxwgv:GridViewDataColumn FieldName="SecondaryCity" VisibleIndex="10" Caption="SecondaryCity" Visible="false">
                    </dxwgv:GridViewDataColumn>          
                    <dxwgv:GridViewDataColumn FieldName="SecondaryZipCode" VisibleIndex="10" Caption="SecondaryZipCode" Visible="false">
                    </dxwgv:GridViewDataColumn>          
                    <dxwgv:GridViewDataColumn FieldName="Distance" VisibleIndex="11" Caption="Km pri." ToolTip="Afstand fra lager til kundens primære adresse">
                    </dxwgv:GridViewDataColumn>
                    <dxwgv:GridViewDataColumn FieldName="DistanceSecondary" VisibleIndex="11" Caption="Km sek." ToolTip="Afstand fra lager til kundens sekundære adresse">
                    </dxwgv:GridViewDataColumn>
                </Columns>                                            
            </dxwgv:ASPxGridView>
        </ContentTemplate>
    </asp:UpdatePanel>
      <input type="submit" onclick="btnClick();" />
    <table width="100%">
        <tr>
            <td>
                <div id="map_canvas" style="float:left;width:70%;height:100%;"></div>
            </td>
            <td>
                <div id="directions_panel" style="margin:20px;background-color:#FFEE77;"></div>
            </td>
        </tr>
    </table>
    
</asp:Content>
